<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <select class="province">
        <option value="">请选择省份</option>
        <option value="A001">北京</option>
        <option value="A002">上海</option>
        <option value="A003">湖北</option>
        <option value="A004">湖南</option>
    </select>
    <select class="city" name="" id="">
        <option value="">请选择市/区</option>
        <!-- <option value="A001">朝阳</option>
        <option value="A002">海淀</option>
        <option value="A003">沙河</option>
        <option value="A004">上地</option> -->
    </select>
</body>
<script>
    // 需求
    // 1. 页面加载时 根据数据 生成省份相关的信息 => 放到省份的下拉框
    // 2. 省份的下拉框 切换时 => 从所有数据中找到 当前省份的数据 => 获取省份下的市区集合 => 生成生成市区相关的信息 => 放到市区的下拉框
    // 3.  市区的下拉框 切换时 => 从所有数据中找到 当前市区的数据 => 获取市区下的县/镇集合 => 生成生成县/镇相关的信息 => 放到县/镇的下拉框

</script>

</html>